<template>
  <i :class="iconClass" :style="iconStyle"></i>
</template>

<script setup lang="ts">
import { computed } from 'vue'

const props = defineProps<{
  name: string
  size?: number | string
  color?: string
}>()

const iconClass = computed(() => ({
  'iconfont': true,
  [`icon-${props.name}`]: true
}))

const iconStyle = computed(() => ({
  fontSize: typeof props.size === 'number' ? `${props.size}px` : props.size,
  color: props.color
}))
</script>

<style scoped>
@import '//at.alicdn.com/t/font_3254019_ey66q7r4yxj.css';
</style> 